<template>
    <!-- 新增和修改数据 -->
    <el-dialog :close-on-click-modal="false" draggable @open="open" :fullscreen="fullscreen" v-model="dialogVisible"
        width="600" :before-close="handleClose">
        <template #header>
            <div class="dialog-title">
                <div class="left">

                    <div>打印模板</div>
                </div>
                <div class="right">

                    <el-icon style="cursor:pointer;" @click="fullscreen = !fullscreen">
                        <CopyDocument v-if="fullscreen == true" />
                        <FullScreen v-else />
                    </el-icon>
                </div>
            </div>
        </template>
        <div>
            <div style="height: 40px; display: flex;align-items: center;">
                <!-- <el-select size="small" v-model="tableObjData.print_order_code" placeholder="选择单据" style="width: 120px;">
                    <el-option v-for="item in props.printOrderList" :key="item.code" :label="item.name"
                        :value="item.code" />
                </el-select> -->
                <!-- <el-input v-model="tableObjData.name" clearable size="small" placeholder="模板名称" style="width: 120px;" /> -->
                <el-input v-model="tableObjData.lessees_id" clearable size="small" placeholder="归属租户"
                    style="width: 120px;" />
                <el-button style="margin-left: 2px;" @click="getEv(true)" link type="primary">查询</el-button>
            </div>
            <div>
                <el-table height="300" :data="tableObjData.data" style="width: calc(100% - 40px)">
                    <el-table-column show-overflow-tooltip header-align="center" align="center" prop="print_order_name"
                        label="归属单据" width="120" />
                    <el-table-column show-overflow-tooltip header-align="center" align="center" prop="name" label="名称"
                        width="120" />
                    <el-table-column show-overflow-tooltip header-align="center" align="center" prop="lessees_name"
                        label="归属租户" width="180" />
                    <!-- <el-table-column min-width="150px" show-overflow-tooltip header-align="center" prop="template" label="模板字符串" /> -->
                    <el-table-column  align="center" show-overflow-tooltip header-align="center" label="操作" width="120">
                        <template #default="scope">
                            <el-button link type="primary" size="small" @click="editRowEv(scope.row.id)">
                                预览
                            </el-button>
                            <el-button link type="primary" size="small" @click="printEv(scope.row.id)">
                                打印
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>
    </el-dialog>
</template>

<script setup>
import { ref, reactive, onMounted, onActivated } from 'vue'
import { PrintTemplateListGet, PrintTemplatePkGet } from '@/api/setting/printCode/index.js'

import { BasicPrinterDeviceListGet } from '@/api/index1Api/print/index.js'
import {
    FullScreen,
    CopyDocument
} from '@element-plus/icons-vue'
import { loadingStore } from '@/stores/index.js'
const props = defineProps({
    printOrderCode: {
        type: String,
        default: ""
    }
})

const emit = defineEmits(['emitListEditEv'])

const loading = loadingStore()
const dialogVisible = ref(false)
const fullscreen = ref(false)
const tableObjData = reactive({
    name: '',
    print_order_code: '',
    lessees_id: '',
    data: []
})
onMounted(() => {

});
onActivated(() => {

})

const handleClose = (done) => {
    done()
}

const open = async () => {
    await getEv(false)
}

const getEv = async (val) => {
    // loading.loading = true
    console.log('进入查询')
    try {
        loading.loading = true
        let par = {}
        par.print_order_code = props.printOrderCode
        par.lessees_id = tableObjData.lessees_id
        let arr_data = await PrintTemplateListGet(par)
        if (arr_data.status != 200) {
            return
        }
        tableObjData.data = arr_data.data.result.data
        if (val == true) {
            ElMessage.success('查询成功')
        }

    } catch (error) {
        ElMessage.error('查询接口请求失败' + error)
    } finally {
        loading.loading = false
    }
}


// 编辑行
const editRowEv = async (rowId) => {
    // emit('emitListEditEv',)
    try {
        let arr_data = await PrintTemplatePkGet(rowId)
        if (arr_data.status != 200) {
            return
        }
        dialogVisible.value = false
        emit('emitListEditEv', arr_data.data.result)
    } catch (error) {
        ElMessage.error('获取单个数据接口请求失败' + error)
    } finally {
        loading.loading = false
    }
}

const printEv = async (val) => {
    try {
        loading.loading = true

        let arr_data = await BasicPrinterDeviceListGet()
        if (arr_data.status != 200) {
            return
        }
        console.log(arr_data.data.result)
        // tableObjData.data = arr_data.data.result.data
        if (val == true) {
            ElMessage.success('查询成功')
        }

    } catch (error) {
        ElMessage.error('查询接口请求失败' + error)
    } finally {
        loading.loading = false
    }
}


defineExpose({
    loading,
    dialogVisible,
    tableObjData,
    getEv,

})

</script>

<style lang='less' scoped>
.dialog-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
</style>